﻿<style type="text/css">
.rollBox{width: 330px;overflow: hidden; float:left; margin:0 auto;}
.rollBox .Cont{width: 330px;overflow: hidden;}
.rollBox .ScrCont{width: 10000000px;}
.rollBox .Cont .pic{width: 170px;float: left;display: inline;margin: 0;}
.rollBox #List1, .rollBox #List2{float: left;}
</style>
<div class="rollBox"> <a href="javascript:;" onmousedown="ISL_GoDown()" onmouseup="ISL_StopDown()" onmouseout="ISL_StopDown()"
                                    hidefocus="true"></a>
  <div class="Cont" id="ISL_Cont">
    <div class="ScrCont">
      <div id="List1">
        <!-- 图片列表 begin -->
        #foreach($item in $biz.GetList("en_product",8,"is_red=1"))
        #set($width=115)
        #set($height=147)
        <div class="pic">
          <table border="0" cellpadding="0" cellspacing="0">
            <tr>
              <td valign="middle" align="center" width="$width" height="$height" style="border: solid 1px #ccc"><a href="$html.url('show',${item.id})" title="${item.title}"><img src="${item.img_url}" alt="${item.title}" width="$width" height="$height"
                                                onload="ImgFix(this,$width,$height)" border="0" /></a></td>
            </tr>
          </table>
        </div>
        #end
        <!-- 图片列表 end -->
      </div>
      <div id="List2"> </div>
    </div>
    <a href="javascript:;" onmousedown="ISL_GoUp()" onmouseup="ISL_StopUp()" onmouseout="ISL_StopUp()"
                                        hidefocus="true"></a> </div>
</div>
<script type="text/javascript">
    var Speed = 10; //速度(毫秒)
    var Space = 5; //每次移动(px)
    var PageWidth = 170; //翻页宽度,与图片宽度一致
    var fill = 0; //整体移位
    var MoveLock = false;
    var MoveTimeObj;
    var Comp = 0;
    var AutoPlayObj = null;
    GetObj("List2").innerHTML = GetObj("List1").innerHTML;
    GetObj('ISL_Cont').scrollLeft = fill;
    GetObj("ISL_Cont").onmouseover = function () { clearInterval(AutoPlayObj); }
    GetObj("ISL_Cont").onmouseout = function () { AutoPlay(); }
    AutoPlay();
    function GetObj(objName) {
        if (document.getElementById) { return eval('document.getElementById("' + objName + '")') } else {
            return eval
('document.all.' + objName)
        }
    }
    function AutoPlay() { //自动滚动
        clearInterval(AutoPlayObj);
        AutoPlayObj = setInterval('ISL_GoDown();ISL_StopDown();', 2000); //间隔时间
    }
    function ISL_GoUp() { //上翻开始
        if (MoveLock) return;
        clearInterval(AutoPlayObj);
        MoveLock = true;
        MoveTimeObj = setInterval('ISL_ScrUp();', Speed);
    }
    function ISL_StopUp() { //上翻停止
        clearInterval(MoveTimeObj);
        if (GetObj('ISL_Cont').scrollLeft % PageWidth - fill != 0) {
            Comp = fill - (GetObj('ISL_Cont').scrollLeft % PageWidth);
            CompScr();
        } else {
            MoveLock = false;
        }
        AutoPlay();
    }
    function ISL_ScrUp() { //上翻动作
        if (GetObj('ISL_Cont').scrollLeft <= 0) {
            GetObj('ISL_Cont').scrollLeft = GetObj
('ISL_Cont').scrollLeft + GetObj('List1').offsetWidth
        }
        GetObj('ISL_Cont').scrollLeft -= Space;
    }
    function ISL_GoDown() { //下翻
        clearInterval(MoveTimeObj);
        if (MoveLock) return;
        clearInterval(AutoPlayObj);
        MoveLock = true;
        ISL_ScrDown();
        MoveTimeObj = setInterval('ISL_ScrDown()', Speed);
    }
    function ISL_StopDown() { //下翻停止
        clearInterval(MoveTimeObj);
        if (GetObj('ISL_Cont').scrollLeft % PageWidth - fill != 0) {
            Comp = PageWidth - GetObj('ISL_Cont').scrollLeft % PageWidth + fill;
            CompScr();
        } else {
            MoveLock = false;
        }
        AutoPlay();
    }
    function ISL_ScrDown() { //下翻动作
        if (GetObj('ISL_Cont').scrollLeft >= GetObj('List1').scrollWidth) {
            GetObj('ISL_Cont').scrollLeft =
GetObj('ISL_Cont').scrollLeft - GetObj('List1').scrollWidth;
        }
        GetObj('ISL_Cont').scrollLeft += Space;
    }
    function CompScr() {
        var num;
        if (Comp == 0) { MoveLock = false; return; }
        if (Comp < 0) { //上翻
            if (Comp < -Space) {
                Comp += Space;
                num = Space;
            } else {
                num = -Comp;
                Comp = 0;
            }
            GetObj('ISL_Cont').scrollLeft -= num;
            setTimeout('CompScr()', Speed);
        } else { //下翻
            if (Comp > Space) {
                Comp -= Space;
                num = Space;
            } else {
                num = Comp;
                Comp = 0;
            }
            GetObj('ISL_Cont').scrollLeft += num;
            setTimeout('CompScr()', Speed);
        }
    }
</script>
